﻿
<div id="app">
    <div class="app-container">
        <div class="content-header">
            <h3>项目简介[<em style="color:#ff0000">@GlobalConfig.EnvironmentName</em>]</h3>
            <h5>在线用户[<em style="color:#ff0000" v-on:click="handleManage">{{ onlineCount }}</em>]</h5>
        </div> 
        <div class="box"> 
            <div class="block">
                <el-timeline> 
                    <el-timeline-item timestamp="2023/2/01" placement="top">
                        <el-card style="border-radius: 30px">
                            <p><strong>SFA.Support 提供服务</strong></p>                       
                            <el-badge value="✓" class="item" type="primary">
                                <el-tag size="small" type="success">有数信息查询</el-tag>
                            </el-badge>  
                             <el-badge value="✓" class="item" type="primary">
                                <el-tag size="small" type="success">有数信息批量导出</el-tag>
                            </el-badge>  
                        </el-card>
                    </el-timeline-item>
                    <el-timeline-item timestamp="2023/2/01" placement="top">
                        <el-card style="border-radius: 30px">
                            <p><strong>原型图展示</strong></p>
                            <el-badge value="x" class="item">
                                <el-tag size="small" type="danger">原型图文件上传</el-tag>
                            </el-badge>
                            <el-badge value="✓" class="item" type="primary">
                                <el-tag size="small" type="success">原型图效果预览</el-tag>
                            </el-badge> 
                        </el-card>
                    </el-timeline-item>
                    <el-timeline-item timestamp="2023/2/01" placement="top">
                        <el-card style="border-radius: 30px">
                            <p><strong>数据监控</strong></p>
                            <el-tag>NPS数据监控</el-tag>
                            <el-tag>NPS数据异常邮件通知</el-tag>
                        </el-card>
                   </el-timeline-item>
                       <el-timeline-item timestamp="2023/2/01" placement="top">
                        <el-card style="border-radius: 30px">
                            <p><strong>服务监控</strong></p>
                            <el-tag>API接口监控</el-tag>
                            <el-tag>站点监控</el-tag>
                            <el-tag>Windows Services接口监控</el-tag>
                        </el-card>
                   </el-timeline-item>
                </el-timeline>
            </div>
        </div>
    </div>
</div> 
<script type="module">
    import { connection } from '../../js/signalr/es6Chat.js'//记得带上{}花括号
    var vue = new Vue({
        el: '#app',
        data: {
            apiUrl: site_host_url,
            onlineCount: 0,  
        },
        created() {
            let thisVue = this;
            connection.on("WebMessage", function (title, message) {
                thisVue.handleNotify(title, message);
            });
            connection.on("ListenerOnline", function (data) {
                thisVue.onlineCount = data; 
            }); 
        },
        methods: {
            handleNotify(title, message) {
                this.$notify({
                    title: title,
                    message: message,
                    type: 'success'
                });
            },
            handleManage(){
                window.location.href = "/pages/manage/index.html";
            }, 
            handleSelect(key, keyPath) {
                console.log(key, keyPath);
            }
        }
    })
</script>